<template>
	<view>
		<uni-card>
			<image :src="currShop.imgSrc[0].imgSrc"></image>
		</uni-card>
		<uni-card>
			<text class="small">仅需<text style="color: #DD524D; font-size: large;">{{currShop.price}}</text>元/件</text>
			<br />
			<text class="small">{{currShop.name}}</text>
			<br />
			<text class="small">参考重量：{{currShop.weight}}kg</text>
			<br />
			<text class="small">上架时间：{{currShop.issueDate}}</text>
			<br />
		</uni-card>
		<view v-for="item in currShop.imgSrc">
			<image :src="item.imgSrc"></image>
		</view>
		<view class="position-sticky fixed-bottom">
			<uni-goods-nav :fill="true" :options="options" :buttonGroup="buttonGroup" @click="onClick"
				@buttonClick="buttonClick" />
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				username: uni.getStorageSync("token"),
				currShop: {
					name: '',
					imgSrc: [{}],
					id: 0,
					weight: 0,
					issueDate: '',
					price: 0,
					number: 0,
				},
				options: [{
					icon: 'shop',
					text: '店铺',
					infoBackgroundColor: '#007aff',
					infoColor: "red"
				}, {
					icon: 'cart',
					text: '购物车',
					info: 0
				}],
				buttonGroup: [{
					text: '加入购物车',
					backgroundColor: '#ff0000',
					color: '#fff'
				}],
			}
		},
		onLoad(option) {
			// console.log(option.id);
			uni.request({
				url: "http://localhost:8081/shop/selectShopById?id=" + option.id + "&username=" + this.username,
				success: (res) => {
					this.currShop = res.data.shop;
					this.currShop.number = res.data.shopNum;
					// console.log("购物车中商品数量：" + this.currShop.number);
					this.options[1].info = this.currShop.number;
				}
			})
		},
		methods: {
			onClick(e) {
				if (e.content.text == '购物车') {
					uni.reLaunch({
						url: "shopCar"
					});
				}
			},
			//点击“添加购物车”
			buttonClick(e) {
				// console.log(e)
				this.options[1].info++; /* 页面购物车数据加一 */
				//商品首次加入购物车
				if (this.currShop.number == 0) {
					this.currShop.number++;
					let shopCar = this.currShop;
					shopCar.username = this.username;
					uni.request({
						url: 'http://localhost:8081/shopCar/insertShopCar',
						method: 'POST',
						data: shopCar,
						success: (res) => {

						},
					})
				} else {
					/* 改变购物车中该商品数目 */
					//修改商品数量
					this.currShop.number++;
					let shopCar = this.currShop;
					shopCar.username = this.username;
					uni.request({
						url: 'http://localhost:8081/shopCar/updateShopCar',
						method: 'POST',
						data: shopCar,
						success: (res) => {

						},
					})
				}
			},

		},
		//监听器
		onShow() {

			//uni获取本地数据API
			uni.getStorage({
				key: 'token', //数据key值，也就是你存储数据时的名称
				success: function(res) {
					//数据成功获取，用户已登录
					// console.log(res.data);
				},
				fail: function(res) {
					//数据未获取成功，用户没有登录，这里我们直接跳转到登录页面

					uni.navigateTo({
						url: '../user/login',

					});

				},
			})
		}
	}
</script>

<style>
	.position-sticky {
		position: -webkit-sticky !important;
		position: sticky !important;
	}

	.fixed-bottom {
		position: fixed;
		right: 0;
		bottom: calc(var(--window-bottom) + 3px);
		left: 0;
		z-index: 1030;
		margin-bottom: 6;
	}

	.small {
		font-size: small;
	}
</style>
